.classify-modal {
  position: absolute;
  top: 35px;
  left: -40px;
  z-index: 5;
  width: 720px;

  .hd {
    height: 32px;
    background: url('@/assets/image/song-sheet/modal-header.png') no-repeat;

    .icon {
      position: absolute;
      top: 2px;
      left: 132px;
      display: inline-block;
      width: 24px;
      height: 11px;
      vertical-align: middle;
      background: url('@/assets/image/music-audio/iconall.png');
      background-position: -48px 0;
    }
  }

  .bd {
    width: 700px;
    padding: 0 10px;
    background: url('@/assets/image/song-sheet/modal-header.png');
    background-position: -720px 0;
    background-repeat: repeat-y;

    .hot {
      padding-bottom: 11px;
      border-bottom: 1px solid #e6e6e6;

      .hot-btn {
        display: inline-block;
        width: 75px;
        height: 26px;
        margin-left: 26px;
        line-height: 26px;
        color: #333;
        text-align: center;
        cursor: pointer;
        background: url('@/assets/image/my-music/icon-button.png') no-repeat;
        background-position: 0 -64px;

        .text {
          font-weight: normal;
          color: #333;
        }

        .text:hover {
          text-decoration: underline;
        }
      }
    }

    .list {
      padding-bottom: 15px;

      .item {
        .title {
          display: inline-block;
          width: 70px;
          padding-top: 15px;
          margin: 0 -100px 0 26px;
          font-weight: bold;
          vertical-align: top;

          .icon {
            display: inline-block;
            width: 23px;
            height: 23px;
            margin-right: 8px;
            margin-bottom: 4px;
            overflow: hidden;
            vertical-align: middle;
            background: url('@/assets/image/icon.png') no-repeat;
            background-position: -20px -735px;
          }

          .style {
            background-position: 0 -60px;
          }

          .scene {
            background-position: 0 -88px;
          }

          .emotion {
            background-position: 0 -117px;
          }

          .theme {
            background-position: 0 -141px;
          }

          .text {
            display: inline-block;
            vertical-align: middle;
          }
        }

        .sub-list {
          display: inline-block;
          padding: 16px 15px 0;
          margin-left: 96px;
          line-height: 24px;
          vertical-align: top;
          border-left: 1px solid #e6e6e6;

          .sub-list-item {
            display: inline-block;
            color: #333;
            white-space: nowrap;
            cursor: pointer;

            .text {
              display: inline-block;
              vertical-align: middle;
            }

            .line {
              display: inline-block;
              margin: 0 8px 0 10px;
              color: #d8d8d8;
              vertical-align: middle;
            }
          }
        }
      }
    }
  }

  .ft {
    height: 20px;
    background: url('@/assets/image/song-sheet/modal-header.png');
    background-position: -1440px -12px;
  }
}
